<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>My sephora</title>
    <link rel="stylesheet" href="./css/goods-list.css">
    <link rel="stylesheet" href="./iconfont/iconfont.css">
    <link rel="stylesheet" href="./css/reset.css">
    <link rel="stylesheet" href="./iconfont2/iconfont.css">
</head>

<body>
    <!-- 头部 -->
    <div class="header">
        <div class="header-list w">
            <!-- 左边 -->
            <div class="header-left">
                <span>欢迎来到丝芙兰</span>
                <span>请登录</span>
                <span>免费注册</span>
                <span>手机验证码登录</span>
            </div>
            <!-- 中间 -->
            <span class="header-middle">丝芙兰防诈骗公告</span>
            <!-- 右边 -->
            <div class="header-right">
                <span class="header-magin">
                    <img src="./images/i.png" alt="" class="header-magin">
                    <span>我的丝芙兰</span>
                    <i class="iconfont">&#xe6ec;</i>
                </span>
                <div class="header-magin">
                    <img src="./images/v.png" alt="">
                    <span>会员俱乐部</span>
                </div>
                <div class="header-magin">
                    <i class="iconfont">&#xe62f;</i>手机丝芙兰
                </div>
                <div class="header-magin">帮助中心</div>
                <div class="header-magin">品牌合作</div>
            </div>
        </div>
    </div>
    <!-- header结束 -->
    <!-- logo开始 -->
    <div class="sephora">
        <div class="logo w">
            <a href="http://localhost:3000/1.index.html">
                <img src="../images/logo.png" alt="">
            </a>
            <div class="logo-center">
                <input type="text" placeholder="&nbsp;&nbsp;&nbsp;&nbsp;肌智精华方案"><button>搜索</button>
                <div class="logo-search">
                    <span>金秋热卖狂欢</span>
                    <span>换季护肤合集</span>
                    <span>轻熟肌抗氧精华</span>
                    <span>初秋气质裸棕妆</span>
                    <span>必买小众香氛</span>
                    <span>丝芙兰大牌周</span>
                </div>
            </div>

            <div class="logo-right">
                <i class="iconfont">&#xe69d;</i>
                <span>购物袋</span>
                <span class="red">0</span>
                <span>件</span>
            </div>
        </div>
    </div>
    <!-- logo结束 -->

    <!-- 全部商品类目开始 -->
    <div class="both-shadow">
        <div class="both-box w">
            <div class="both-bgi">全部商品类目</div>
            <div class="both-detail">
                <a href="">畅销榜单</a>
                <a href="">独家发售</a>
                <a href="">礼物套装</a>
                <a href="">全部品牌</a>
                <a href="">预约中心</a>
            </div>
            <img src="./images/navigation_shopping.png" alt="" class="both-src">
        </div>
    </div>

    <!-- 全部商品类目结束 -->
    <!-- 首页开始 -->
    <div class="first-list w">
        <span>首页</span>
        <span>&gt;</span>
        <span>化妆品品牌大全</span>
        <span>&gt;</span>
        <span>3CE/三熹玉</span>
    </div>
    <!-- 首页结束 -->

    <!-- banner开始 -->
    <div class="banner w">
        <div class="banner-story">
            <img src="./images/3celogo.png" alt="">
            <h1>品牌故事</h1>
        </div>
        <ul>
            <li>丝绒唇釉</li>
            <li>九宫格眼影</li>
            <li>烟管口红</li>
            <li>单色腮红</li>
        </ul>

    </div>
    <!-- banner结束 -->

    <!-- sort-list开始 -->
    <div class="sort-list w">
        <div class="sort">
            <span>分类</span>
            <span>彩妆</span>
        </div>
        <div class="sort-checkbox">
            <span>适用部位</span>
            <span>唇部</span>
            <span>眼部</span>
            <span>面部</span>
            <span class="sort-float">+多选</span>
        </div>
        <div class="sort-checkbox">
            <span>功效</span>
            <span>修饰肤色</span>
            <span>造型</span>
            <span>提亮肤色</span>
            <span>多种功效</span>
            <span>遮瑕</span>
            <span class="sort-float">+多选</span>
        </div>
        <div class="sort-checkbox">
            <span>价格</span>
            <span>0-100元</span>
            <span>101-300元</span>
            <span>301-600元</span>
            <span class="sort-float">+多选</span>
        </div>
        <div class="sort-checkbox">
            <span>适合肤质</span>
            <span>各种肤质</span>
            <span class="sort-float">+多选</span>
        </div>
    </div>

    <!-- 还有一个下拉菜单没写 -->

    <!-- sort-list结束 -->

    <!-- 综合开始 -->
    <div class="mix w">
        <div class="mix-left">
            <div class="mix-bgc">综合
                <i class="iconfont">&#xe600;</i>
            </div>
            <div class="mix-center">
                <div>
                    <span>销量</span>
                    <i class="iconfont">&#xe600;</i>
                </div>
                <div>
                    <span>新品</span>
                    <i class="iconfont">&#xe600;</i>
                </div>
                <div>
                    <span>人气</span>
                    <i class="iconfont">&#xe600;</i>
                </div>
                <div class>
                    <span>价格</span>
                    <i class="iconfont">&#xe6ed;</i>
                </div>
            </div>
            <div class="mix-only">
                <input type="checkbox">
                <span>仅看有货</span>
            </div>
        </div>
        <div class="mix-right">
            <span class="mix-number">1</span>
            <span>/3</span>
            <span>&lt;</span>
            <span>&gt;</span>
        </div>
    </div>
    <!-- 图 -->
    <div class="goodsimg w">
        <!-- <div class="goods-every-img">
            <img src="./images/3ce-yy.jpg" alt="">
            <h1>新品</h1>
            <h2>3CE</h2>
            <p>九色纷呈眼影盘</p>
            <h3 >￥230.00</h3>
        </div> -->

        <div class="list-menu">
            <div>&lt;上一页</div>
            <div>1</div>
            <div>2</div>
            <div>3</div>
            <div>下一页&gt;</div>
            <div>到第</div>
            <div></div>
            <div>页</div>
            <div>确定</div>
        </div>
    </div>
    <!-- 综合结束 -->

    <!-- 物流小车开始 -->
    <div class="car w">
        <div class="ems">
            <i class="iconfont">&#xe683;</i>
            <span>顺丰EMS速达</span>
        </div>
        <div class="ems">
            <i class="iconfont">&#xe611;</i>
            <span>丰富礼赠</span>
        </div>
        <div class="ems">
            <i class="iconfont">&#xe604;</i>
            <span>100%官方正品</span>
        </div>
        <div class="ems">
            <i class="iconfont">&#xe629;</i>
            <span>无障碍退款</span>
        </div>
        <div class="ems">
            <i class="iconfont">&#xe669;</i>
            <span>安全支付</span>
        </div>
    </div>
    <!-- 物流小车结束 -->

    <!-- 购物流程说明开始 -->
    <div class="shopping w">
        <ul class="shopping-box">
            <li class="headerText">购物流程</li>
            <li class="secondText">大宗采购/团购</li>
            <li class="secondText">丝芙兰预付卡章程</li>
        </ul>
        <ul class="shopping-box">
            <li class="headerText">支付/配送</li>
            <li class="secondText">在线支付</li>
            <li class="secondText">配送时间</li>
        </ul>
        <ul class="shopping-box">
            <li class="headerText">售后服务</li>
            <li class="secondText">退换货规定</li>
            <li class="secondText">退换及退款说明</li>
        </ul>
        <ul class="shopping-box">
            <li class="headerText">关于丝芙兰</li>
            <li class="secondText">公司介绍</li>
            <li class="secondText">联系我们</li>
            <li class="secondText">品牌合作/Brand Collaboration</li>
            <li class="secondText">隐私政策</li>
        </ul>
        <ul class="shopping-box">
            <li class="headerText">网上订购咨询热线 : 400 670 0055</a>
        </ul>
        <ul class="blank">
            <li></li>
            <li></li>
            <li></li>
            <li></li>
        </ul>
    </div>
    <!-- 购物流程说明结束 -->

    <!-- footer -->
    <div class="footer">
        <div class="footer-main w">
            <img src="./images/footer-oneonezero-icon.png" alt="">
            <span class="marginRight">沪公网安备 31010602003121号</span>
            <span class="marginRight">ICP备案序号:沪ICP备05026645号</span>
            <span class="marginRight">食品经营许可证</span>
            <span class="marginRight">食品经营许可证</span>
            <span>严正声明</span>
            <br>
            <div class="Linkus">
                <span>本网站隶属于丝芙兰（上海）化妆品销售有限公司</span>
                <span>企业法人营业执照</span>
                <span>预付卡信息对接唯一标识 : 310101F5201530100309</span>
            </div>
        </div>
    </div>
</body>
<script src="./js/ajax.js"></script>
<script src="./libs/require.js" data-main="./js/goods-list.js"></script>
</html>
